<template>
    <div class="app-container">
       
            <!-- 固定宽度的侧边栏 -->
            <div class="aside">
                <Aside/>
            </div>
            <!-- 自适应宽度的主内容区域 -->
            <div class="main">
                <Main/>
            </div>
       
    </div>
</template>

<script setup lang="ts">
import Aside from './components/Aside.vue'
import Main from './components/Main.vue'
</script>

<style lang="scss" scoped>
.app-container {
    height: 100vh;
    widows: 100vw;
    display: flex;
}

.aside{
    width: 300px;
    height: 100%;
}

.main{
   flex: 1;
    height: 100%;
}
</style>